body {
    min-height: 100vh;
    margin: 0;
    background-color: #4C4C4C;
    background-image: url('./background.png');
    background-size: cover;
    background-position: center;

    font-family: sans-serif;

    display: flex;
    align-items: center;
    justify-content: center;
}

.wrapper {
    width: 850px;
    /*border: 1px solid red;*/

    display: flex;
}

video {
    box-shadow: 0 0 1px 3px rgba(0, 0, 0, 0.1);
}

.speed {
    margin: 10px;
    background-color: #efefef;
    border-radius: 50px;
    box-shadow: 0 0 1px 3px rgba(0, 0, 0, 0.1);

    flex: 1; /* 布满剩余的父元素空间 */
    display: flex;
    align-items: flex-start; /* 与交叉轴的起点对齐 */
    overflow: hidden;
}

.speed-bar {
    width: 100%;
    height: 16.3%;
    padding: 2px;
    background: linear-gradient(-170deg, #2376ae 0%, #c16ecf 100%);

    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
    color: white;

    display: flex;
    align-items: center;
    justify-content: center;
}
